<template>
  <page-header-wrapper>
    <a-card :bordered="false">
      <div class="table-page-search-wrapper">
        <a-row type="flex" justify="start">
          <span
            v-for="audit in AuditStatusArray"
            :key="audit.code"
            @click="selected(audit.code)"
            style="margin-right: 60px"
            :class="{'active': audit.code === auditStatus}"
            class="mouseOn"
          >{{ audit.message }}</span>
        </a-row>
        <a-row type="flex" justify="start" style="margin: 20px 0">
          <a-col :span="4" style="margin-right: 10px">
            <a-input v-model="entName" placeholder="输入企业名" allow-clear></a-input>
          </a-col>
          <a-col :span="4" style="margin-right: 10px">
            <a-input v-model="entCertName" placeholder="输入荣誉证书名" allow-clear></a-input>
          </a-col>
          <a-col :span="4">
            <a-config-provider :auto-insert-space-in-button="false">
              <a-button type="primary" @click="toSearch">查找</a-button>
            </a-config-provider>
          </a-col>
        </a-row>
      </div>
      <a-table
        :scroll="{ x: 1500}"
        :columns="columns"
        :data-source="entHonorList"
        bordered
        :pagination="pagination"
        :rowKey="record=>record.id"
      >
        <div slot="edit" slot-scope="item,record">
          <a @click="toContent(record.id,record.entName)">{{record.auditStatus === 1 ? "审核" : "查看"}}</a>
        </div>
      </a-table>
    </a-card>
  </page-header-wrapper>
</template>

<script>
import { AuditStatusArray, getAuditStatusMsg } from '@/utils/auditStatus'
import { getEntCertList } from '@/api/entVerify'
export default {
  data() {
    return {
      entName:'',
      entCertName:'',
      auditStatus: -1,
      AuditStatusArray: AuditStatusArray,
      pagination: {
        total: 0,
        pageSize: 10,
        current: 1,
        showSizeChanger: true,
        pageSizeOptions: ['10', '20', '30', '40', '50'],
        showTotal: total => `共有 ${total} 条数据`,
        showQuickJumper: true,
        onShowSizeChange: (current, pageSize) => this.onSizeChange(current, pageSize),
        onChange: (page, pageSize) => this.onPageChange(page, pageSize)
      },
      columns: [
        {
          title: '编号',
          dataIndex: 'num',
          align: 'center',
          width:100,
          // customRender: (text, record, index) => `${index + 1}`, // 显示每一行的序
          customRender: (text, record, index) => `${(this.pagination.current - 1) * 10 + index + 1}` // 显示每一行的序
        },
        {
          title: '企业名称',
          dataIndex: 'entName',
          // align: 'center'
        },
        {
          title: '荣誉证书名称',
          dataIndex: 'certName',
          // align: 'center'
        },
        {
          title: '创建时间',
          dataIndex: 'createTime',
          align: 'center',
        },
        {
          title: '更新时间',
          dataIndex: 'updateTime',
          align: 'center',
        },
        {
          title: '审核状态',
          dataIndex: 'auditStatus',
          align: 'center',
          customRender: (text, record, index) => getAuditStatusMsg(text)
        },
        {
          title: '操作',
          dataIndex: 'edit',
          align: 'center',
          width:100,
          fixed: 'right',
          scopedSlots: { customRender: 'edit' }
        }
      ],
      entHonorList: []
    }
  },
  methods: {
    pageChange(pageNumber) {
      console.log('Page: ', pageNumber)
    },
    toSearch() {
      this.pagination.current = 1
      this.getList()
    },
    selected(code) {
      this.pagination.current = 1
      this.auditStatus = code
      this.getList()
    },
    toContent(id,entName) {
      // this.$router.push({name: 'HornorAwards'})
      // this.$router.push('/infoVerify/HornorAwards?id=' + id)
      this.$router.push({
          path: '/infoVerify/HornorAwards',
          query:{id,entName}
      })
    },
    //变更每页条数
    onSizeChange(current, size) {
      this.pagination.current = current
      this.pagination.pageSize = size
      this.getList()
    },
    //翻页
    onPageChange(page, pageSize) {
      this.pagination.current = page
      this.getList()
    },
    //获取列表数据
    getList() {
      let _this = this
      let _params = {
        auditStatus: _this.auditStatus,
        entName: _this.entName,
        certName: _this.entCertName,
        type: 2,
        current: _this.pagination.current,
        size: _this.pagination.pageSize
      }
      console.log(_params)
      getEntCertList(_params)
        .then(res => {
          console.log('荣誉')
          console.log(res)
          if (res.code == 200) {
            _this.pagination.total = res.data.total
            _this.entHonorList = res.data.records
          }
        })
        .catch(error => {})
    }
  },
  created() {
    this.getList()
  },
  computed: {
    // rowSelection() {
    //   return {
    //     onChange: (selectedRowKeys, selectedRows) => {
    //       // console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
    //     }
    //   }
    // }
  }
}
</script>

<style lang="less" scoped>
.active {
  color: #1890ff !important;
}
.mouseOn:hover {
  cursor: pointer;
  color: #1890ff !important;
}
</style>
